<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="${ctx }" >


<script type="text/javascript"
	src="http://webapi.amap.com/maps?v=1.3&amp;key=f9d326eec206fa5f8ae57ccb028fc9bb&amp;"></script>



<!-- 字符编码 -->
<meta charset="UTF-8" content="">
<!-- IE兼容模式 -->
<meta http-equiv="X-UA-COMPATIBLE" content="IE=edge">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<!-- 采用高速模式渲染（目前仅有360支持） -->
<meta name="renderer" content="webkit">
<!-- Bootstrap 核心 CSS库 -->
<link href="${ctx }/styles/BJUI/new/css/bootstrap.min.css"
	rel="stylesheet">
<!-- Font-awesome 图标 CSS库 -->
<link href="${ctx }/styles/BJUI/new/css/font-awesome.min.css"
	rel="stylesheet">
<!-- JQuery UI CSS库 -->
<link href="${ctx }/styles/BJUI/new/css/jquery-ui.min.css"
	rel="stylesheet">
<!-- JQuery -->
<script src="${ctx }/styles/BJUI/new/js/jquery-1.10.2.min.js"
	type="text/javascript"></script>
<script src="${ctx }/styles/BJUI/new/js/jquery.unobtrusive-ajax.min.js"
	type="text/javascript"></script>
<!-- JQuery UI -->
<script src="${ctx }/styles/BJUI/new/js/jquery-ui.min.js"
	type="text/javascript"></script>
<!-- 脉动提示插件 -->
<script src="${ctx }/styles/BJUI/new/js/jquery.pulsate.min.js"
	type="text/javascript"></script>
<!-- Bootstrap 核心 JS库 -->
<script src="${ctx }/styles/BJUI/new/js/bootstrap.min.js"
	type="text/javascript"></script>
<!-- 浏览器判断 -->
<script src="${ctx }/styles/BJUI/new/js/Browser.js"
	type="text/javascript"></script>
<!-- 母版页 样式 -->
<link href="${ctx }/styles/BJUI/new/css/carousel.css" rel="stylesheet">
<link href="${ctx }/styles/BJUI/new/css/style.css" rel="stylesheet">
<link href="${ctx }/styles/BJUI/new/css/leon.css" rel="stylesheet">
<link href="${ctx }/styles/BJUI/new/css/index.css" rel="stylesheet">
<title>下单</title>

</head>
<!-- Start: Ajax Tiper -->
<!-- Start AJAX提示（全局） -->
<link href="${ctx }/styles/BJUI/new/css/nprogress.css" rel="stylesheet">
<script src="${ctx }/styles/BJUI/new/js/nprogress.js"></script>
<script type="text/javascript">
    var CurrAjaxCount = 0;
    $(document).ready(function () {
        $(document).ajaxStart(function () {
            if (CurrAjaxCount == 0) {
                NProgress.start();
            }
            CurrAjaxCount = CurrAjaxCount + 1;
        }).ajaxStop(function () {
            CurrAjaxCount = CurrAjaxCount - 1;
            if (CurrAjaxCount <= 0) {
                NProgress.done();
            }
        });
    });
</script>
<!-- End AJAX提示（全局） -->
<!-- End: Ajax Tiper -->

<!-- Start: Browser Tiper -->
<link href="${ctx }/styles/BJUI/new/css/Browsertiper.css" rel="stylesheet"/>


<!-- End: Browser Tiper -->
<div class="clearfix">
<form id="form">

<input id="codeId"
			type="hidden" name="codeId" />
		
    <div class="carousel-inner" id="mainWindow" style="position: relative">
        <div class="row">
            <div class="col-sm-8 box-40-mb-1 text-center">
                <span class="label-text">验证当前手机号</span>
            </div>
            <div class="col-sm-8 box-40-mb-1">
                <input id="mobilePhone"  name ="mobilePhone" class="input-max" placeholder="请输入手机号码">
            </div>
            <div class="col-sm-8 box-40-mb-1">
                <div class="bs-example" data-example-id="simple-justified-button-group">
                    <div class="btn-group btn-group-justified label-and-input display-right" role="group"
                         aria-label="Justified button group"
                         style="width: 30%;margin-right: 10px;margin-top: 6px">
                        <a onclick="sendCode()" class="btn btn-default color-border-deep-blue" role="button"
                           style="font-size: 10px;padding: 4px 12px 4px">点击发送验证码</a>
                    </div>
                </div>
                <input id="code" name ="code"   class="input-max display-left placeholder-left" placeholder="验证码">
            </div>
	
            <div class="col-sm-8"
                 style="position: absolute;margin-top:25px;bottom: 0;left: 0;width: 100%;margin-bottom: 0;padding: 0">
                <a class="a-blue">
                    <div class="display-right text-center cursor-pointer"
                         style="width:100%;">
                        <span onclick="subim()"  style="line-height: 50px;color: #ffffff">提交</span>
                    </div>
                </a>
            </div>



        </div>
    </div>
			
			</form>
</div>
<script src="${ctx }/styles/BJUI/new/js/ddes.js" charset="UTF-8"></script>

</body>

<script type="text/javascript" charset="UTF-8">
	function subim()
	{
	
		$.ajax({
			data : $('form').serialize(),
			type : "POST",
			dataType : 'json',
			url : "${ctx }/api/editPhone",
			error : function(data) {
				alert("出错了！！:");
			},
			success : function(data) {
				if (data['ret'] == 0) {
					window.location.href = "${ctx }/weixinView/phoneNEW?mobilePhone="+$("input[id='mobilePhone']").val();
				} else {
					alert(data['msg']);
				}
			}
		});
	}
	function sendCode() {
		if (isSending) {
			alert("正在发送短信，请勿频繁操作");
			return;
		}
		alert("正在发送短信，请勿频繁操作");
		$.ajax({
			data : {
				"phoneNum" : $("input[id='mobilePhone']").val()
			},
			type : "POST",
			dataType : 'json',
			url : "${ctx }/weixinView/sendVerifys",
			error : function(data) {
				isSending = false;
				alert("出错了！！:");
			},
			beforeSend : function(data) {
				isSending = true;
			},
			success : function(data) {
				if (data['status'] == 0) {
					isSending = false;
						BizId = data['data'];
					$("input[id='codeId']").val(BizId);
					alert(data['msg']);
				} else {
				//	alert(data['msg']);
					isSending=false;
				}
			}
		});
	}

	var isSending = false;
	var BizId="";
    var windowH = $(window).height();
    var mainH = $("#mainWindow").height();

    $(function () {
        if (windowH > mainH) {
            $("#mainWindow").css({height: windowH});
        }
    });

    /* 动态改变页面尺寸 */
    var itemW = $(".col-sm-8").width();
    var label = $(".label-and-input");
    var placeholder = $(".placeholder-left");

    window.onresize = function () {
        itemW = $(".col-sm-8").width();
//        console.log(itemW);
        changeDivHeight();
    };

    $(function () {
        changeDivHeight();
    });

    function changeDivHeight() {
        for (var i = 0; i < label.size(); i++) {
            var labelW = $(label[i]).width();
            $(placeholder[i]).css({width: itemW - labelW - 11});
        }
    }


</script>
</html>
